
.navbar{position:fixed;background-color:#fff;top:0;/*  #ifdef  H5  */top:calc(88rpx + constant(safe-area-inset-top));top:calc(88rpx + env(safe-area-inset-top));/*  #endif  */left:0;z-index:999;width:100%;}
.navbar.on{background-color:#e93323;}
.navbar.black{background-color:#232323;}
.navbar.gray{background-color:#666;}
.navbar.red{background-color:#eb5447;}
.navbar.gradual01{background-image: linear-gradient(to right,#f67837 0%,#f11d09 100%);}
.navbar .navbarH{position:relative;}
.navbar .navbarH .navbarCon{position:absolute;bottom:0;height:100rpx;width:100%;}
.navbar .navbarH .navbarCon .name{color:#000;font-size:36rpx;font-weight:bold;width: 300rpx;text-align: center;}
.navbar .navbarH .navbarCon .name.on{color:#fff;}
.navbar .navbarH .navbarCon .icon-xiangzuo{color:#000;font-weight:bold;position:absolute;font-size:40rpx;left:16rpx;width:100rpx;height:56rpx;line-height:54rpx;top:50%;transform:translateY(-50%);}
.navbar .navbarH .navbarCon .icon-xiangzuo.on{color:#fff;}
.navbar .navbarH .navbarCon .logo{width:127rpx;height:45rpx;position:absolute;left:30rpx;top:50%;transform:translateY(-50%);}
.navbar .navbarH .navbarCon .logo image{width:100%;height:100%;display:block;}
.navbar .navbarH .navbarCon .search{width:360rpx;height:64rpx;background-color:#f7f7f7;border-radius:50rpx;padding:0 28rpx;box-sizing:border-box;font-size:28rpx;color:#bbb;margin-right:26rpx;}
.navbar .navbarH .navbarCon .search .icon-xiazai5{font-size:34rpx;margin-right:16rpx;}